<template>
  <el-aside width="140px">
    <el-menu router :default-active="active" class="el-menu-vertical-demo">
      <el-menu-item :index="item.path" v-for="item in list" :key="item.path">
        <i :class="item.meta.icon"></i>
        <span slot="title">{{ item.meta.title }}</span>
      </el-menu-item>
    </el-menu>
  </el-aside>
  <!-- <div>  
    <router-link tag="p" to="/home/xtgl">系统概览</router-link>
    <router-link tag="p" to="/home/dengji">设备登记</router-link>
    <router-link tag="p" to="/home/guanli">设备管理</router-link>
    <router-link tag="p" to="/home/shuju">数据字典</router-link>
  </div> -->
</template>

<script>
export default {
  name: "AsideView",
  props: ["list"],
  data() {
    return {
      active: this.$route.path,
    };
  },
};
</script>

<style scoped>
.el-aside {
  background-color: #374a63;
  color: rgb(12, 200, 224);
  text-align: center;
  line-height: 70px;
  font-size: 30px;
  display: flex;
  flex-direction: column;
}
.el-menu {
  height: calc(100vh - 60px);
}
</style>